.feed-view {
    display: block;
    height: 100%;
}

.feed-view vaadin-grid {
    height: 100%;
    line-height: var(--lumo-line-height-m);
}

.feed-view vaadin-grid,
.feed-view vaadin-grid-cell-content {
    background-color: var(--lumo-contrast-10pct);
}

.feed-view .card {
    background-color: var(--lumo-base-color);
    border-radius: var(--lumo-border-radius-m);
    box-shadow: var(--lumo-box-shadow-xs);
    padding: var(--lumo-space-m);
}

.feed-view img {
    border-radius: 50%;
    flex-shrink: 0;
    height: var(--lumo-size-m);
    margin-right: calc(var(--lumo-space-s) * 1.5);
    width: var(--lumo-size-m);
}

.feed-view .header {
    align-items: baseline;
}

.feed-view .name {
    font-size: var(--lumo-font-size-s);
    font-weight: bold;
    margin-right: var(--lumo-space-s);
}

.feed-view .date {
    color: var(--lumo-tertiary-text-color);
    font-size: var(--lumo-font-size-xs);
}

.feed-view .post {
    color: var(--lumo-secondary-text-color);
    font-size: var(--lumo-font-size-s);
    margin-bottom: var(--lumo-space-s);
    white-space: normal;
}

.feed-view .actions {
    align-items: center;
}

.feed-view .icon {
    color: var(--lumo-tertiary-text-color);
    height: calc(var(--lumo-icon-size-s) * 0.8);
    margin-right: var(--lumo-space-s);
    width: calc(var(--lumo-icon-size-s) * 0.8);
}

.feed-view .likes,
.feed-view .comments,
.feed-view .shares {
    color: var(--lumo-tertiary-text-color);
    font-size: var(--lumo-font-size-xs);
    margin-right: var(--lumo-space-l);
}
